<template>
  <footer class="w3l-footer9">
    <section class="footer-inner-main py-5">
      <div class="container py-md-3">
        <div class="right-side">
          <div class="row footer-hny-grids sub-columns">
            <div class="col-lg-3 sub-one-left">
              <h6>About </h6>
              <p class="footer-phny pe-lg-5">Since 1960,. has built a reputation for producing high quality precision
                fabricated products for use in a variety of industries.</p>
              <div class="columns-2 mt-lg-5 mt-4">
                <ul class="social">
                  <li>
                    <NuxtLink to="#facebook"><span class="fab fa-facebook-f"></span></NuxtLink>
                  </li>
                  <li>
                    <NuxtLink to="#linkedin"><span class="fab fa-linkedin-in"></span></NuxtLink>
                  </li>
                  <li>
                    <NuxtLink to="#twitter"><span class="fab fa-twitter"></span></NuxtLink>
                  </li>
                  <li>
                    <NuxtLink to="#google"><span class="fab fa-google-plus-g"></span></NuxtLink>
                  </li>
                </ul>
              </div>
            </div>
            <div class="col-lg-3 sub-two-right">
              <h6>Services</h6>
              <ul>
                <li>
                  <NuxtLink to="#processing"><i class="fas fa-angle-right"></i> Agriculture Processing</NuxtLink>
                </li>
                <li>
                  <NuxtLink to="#research"><i class="fas fa-angle-right"></i> Chemical Research</NuxtLink>
                </li>
                <li>
                  <NuxtLink to="#metal"><i class="fas fa-angle-right"></i> Metal Engineering</NuxtLink>
                </li>
                <li>
                  <NuxtLink to="#gas"><i class="fas fa-angle-right"></i> Petroleum & Gas</NuxtLink>
                </li>
                <li>
                  <NuxtLink to="#work"><i class="fas fa-angle-right"></i> Mechanical Engineering</NuxtLink>
                </li>
              </ul>
            </div>
            <div class="col-lg-3 sub-two-right">
              <h6>Our Links</h6>
              <ul>
                <li>
                  <NuxtLink to="#why"><i class="fas fa-angle-right"></i> Why us</NuxtLink>
                </li>
                <li>
                  <NuxtLink to="#licence"><i class="fas fa-angle-right"></i> Licensing</NuxtLink>
                </li>
                <li>
                  <NuxtLink to="#log"><i class="fas fa-angle-right"></i> Offers</NuxtLink>
                </li>
                <li>
                  <NuxtLink to="#log"><i class="fas fa-angle-right"></i> Changelog</NuxtLink>
                </li>
                <li>
                  <NuxtLink to="#career"><i class="fas fa-angle-right"></i> Careers</NuxtLink>
                </li>
              </ul>
            </div>
            <div class="col-lg-3 sub-one-left">
              <h6>Recent Posts </h6>
              <div class="row fposts-grid-inner mb-4">
                <div class="col-4 fposts-grid-left ps-0">
                  <NuxtLink to="/blog-single">
                    <img src="/html/assets/images/g2.jpg" alt=" " class="img-fluid radius-image">
                  </NuxtLink>
                </div>
                <div class="col-8 fposts-grid-right">
                  <h4>
                    <NuxtLink to="#home" class="text-bl text-left">Lorem ipsum viverra feugiat libero.</NuxtLink>
                  </h4>
                  <p class="time"> 11 Minutes ago</p>
                </div>
              </div>
              <div class="row fposts-grid-inner mb-4">
                <div class="col-4 fposts-grid-left ps-0">
                  <NuxtLink to="/blog-single">
                    <img src="/html/assets/images/g3.jpg" alt=" " class="img-fluid radius-image">
                  </NuxtLink>
                </div>
                <div class="col-8 fposts-grid-right">
                  <h4>
                    <NuxtLink to="#home" class="text-bl text-left">Lorem ipsum viverra feugiat libero.</NuxtLink>
                  </h4>
                  <p class="time"> 11 Minutes ago</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>

    <!-- Js scripts -->
    <!-- move top -->
    <button @click="scrollToTop" id="movetop" title="Go to top">
      <span class="fas fa-level-up-alt" aria-hidden="true"></span>
    </button>
  </footer>
</template>

<script lang="ts" setup>

const { scrollToTop } = initFooter()

</script>

<style scoped></style>